{template 'common/header'}
{template 'site/nav_style'}
<style>
.template-style{padding:15px 13px 15px 13px; display:block;}
.template-style li{float:left; width:19.4%; max-width:180px; margin:0 2px 10px 2px;}
.template-style .template-style-pic img{width:100%;}
.template-style .template-style-pic{border:3px #EEE solid;position:relative;overflow:hidden;}
.template-style .template-style-pic .icon-ok{display:none;}
.template-style .on.template-style-pic{border:3px #009CD6 solid;}
.template-style .on.template-style-pic .icon-ok{display:inline-block;position: absolute;bottom:0;right:0;color:#FFF;background:#009CD6;padding:5px;font-size:14px;}
.template-style .template-style-button{height:25px; line-height:25px;}
.template-style .template-style-button a{color:#666;}
</style>
<div class="main">
	<ul class="unstyled template-style">
	{loop $templates $item}
	<li>
		<div class="template-style-pic {if $_W['account']['styleid'] == $item['id']}on{/if}"> <!--设为默认风格时class中加on-->
			<img src="./themes/mobile/{$item['name']}/preview.jpg" />
			<span class="icon-ok"></span>
		</div>
		<div class="template-style-button"><a href="{php echo create_url('site/style/default', array('templateid' => $item['id']))}">设为默认</a> <a href="{php echo create_url('site/style/designer', array('templateid' => $item['id']))}">设计风格</a> <!--a href="{php echo create_url('site/template', array('templateid' => $item['id']))}">模板管理</a-->
		<a href="javascript:;" onclick="ajaxpreview();return false;">预览</a></div>
	</li>
	{/loop}
	</ul>
</div>
<script type="text/javascript">
<!--
	function ajaxpreview() {
		var modalobj = $('#modal-preview');
		if(modalobj.length == 0) {
			$(document.body).append('<div id="modal-preview" class="modal hide fade" tabindex="-1" role="dialog" aria-hidden="true" style="position:absolute;top:5%;"></div>');
			var modalobj = $('#modal-preview');
		}
		html = '<iframe width="100%" scrolling="yes" height="100%" frameborder="0" src="<?php echo $preview->index();?>" id="preview" name="preview" style="width: 320px; overflow: visible; height: 480px;"></iframe><div class="modal-footer"><a href="{$_W['siteroot']}{php echo create_url('mobile/channel', array('name' => 'index', 'weid' => $_W['weid']))}" target="preview" class="btn">首页</a><a href="{$_W['siteroot']}{php echo create_url('mobile/channel', array('name' => 'home', 'weid' => $_W['weid']))}" target="preview" class="btn">个人中心</a><a href="#" class="btn" data-dismiss="modal" aria-hidden="true">关闭</a></div>';
		modalobj.html(html);
		modalobj.css({'width' : 320, 'marginLeft' : 0 - 320 / 2});
		modalobj.css({'height' : 480}); 
		modalobj.on('hidden', function(){modalobj.remove();});
		return modalobj.modal({'show' : true});
	}
//-->
</script>
{template 'common/footer'}